<html class="no-js" lang="en">

<head>
	<meta charset="utf-8" />

	<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;" />
	<meta name="format-detection" content="telephone=no" />


	<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
	<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
	<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script> 
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&libraries=geometry"></script>
	
	<script src="js/modernizr.geoloc.js"></script>

<script type="text/javascript"> 

<?php
session_start();
$start = $_REQUEST['start'];
$address = $_SESSION['address'];
$compName = $_SESSION['comp_name'];
$lat = $_SESSION['lat'];
$lng = $_SESSION['lng'];
echo "var start = '$start';";
echo "var address = '$address';";
echo "var compName = '$compName';";
?>

var browserSupportFlag =  new Boolean();
var map;
var geocoder;
var myOptions;
  
var directionDisplay;
var directionsService = new google.maps.DirectionsService();

function initialize() {
	geocoder = new google.maps.Geocoder();
	var des = new google.maps.LatLng(<?php echo $lat;?>, <?php echo $lng;?>);
		
	if (start == "") {
			// The following commented lines display a map with just dest. pin to avoid showing blank page if user denies geolocation
			// var des = results[0].geometry.location;
			// myOptions = {
				// zoom: 10,
				// center: des,
				// mapTypeId: google.maps.MapTypeId.ROADMAP
			// };
			// map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
			// var marker = new google.maps.Marker({
					// position: des, 
					// map: map
			// });
			
		navigator.geolocation.getCurrentPosition(function(position) {
			myOptions = {
			  zoom: 10,
			  center: des,
			  mapTypeId: google.maps.MapTypeId.ROADMAP
			};
			map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
			
			currentLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
			directionsDisplay = new google.maps.DirectionsRenderer();
			directionsDisplay.suppressMarkers = true;
			directionsDisplay.setMap(map);
			map.setCenter(currentLocation);
			
			var request = {
				origin: currentLocation, 
				destination: des,
				travelMode: google.maps.DirectionsTravelMode.DRIVING
			};
			directionsService.route(request, function(response, status) {
				if (status == google.maps.DirectionsStatus.OK) {
					directionsDisplay.setDirections(response);
				}
			});
			
			var marker1 = new google.maps.Marker({
				position: currentLocation, 
				map: map
			});
			var infowindow1 = new google.maps.InfoWindow({ 
				content: "This is your current location."
			});
			google.maps.event.addListener(marker1, 'click', function() {
				infowindow1.open(map,marker1);
			});
			
			// var flag = 'images/flag.png';
			var marker2 = new google.maps.Marker({
				map: map,
				position: des,
				// icon: flag
			});
			var infowindow2 = new google.maps.InfoWindow({ 
				content: "<?php echo $compName . '<br/>' . $address;?>"
			});
			
			// var infowindow3 = new google.maps.InfoWindow({
				// content: "Sparsus"
			// });
			// infowindow3.open(map,marker2);
			google.maps.event.addListener(marker2, 'click', function() {
				infowindow2.open(map,marker2);
			});
		});
	} else {
		geocoder = new google.maps.Geocoder();
		geocoder.geocode( { 'address': start}, function(results, status) {
			if (status == google.maps.GeocoderStatus.OK) {
				myOptions = {
				  zoom: 10,
				  center: results[0].geometry.location,
				  mapTypeId: google.maps.MapTypeId.ROADMAP
				};
				map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
				
				directionsDisplay = new google.maps.DirectionsRenderer();
				directionsDisplay.suppressMarkers = true;
				directionsDisplay.setMap(map);
				
				var request = {
					origin: results[0].geometry.location, 
					destination: des,
					travelMode: google.maps.DirectionsTravelMode.DRIVING
				};
				directionsService.route(request, function(response, status) {
					if (status == google.maps.DirectionsStatus.OK) {
						directionsDisplay.setDirections(response);
					}
				});
				
				var marker1 = new google.maps.Marker({
					position: results[0].geometry.location, 
					map: map
				});
				var infowindow1 = new google.maps.InfoWindow({ 
					content: "This is your current location."
				});
				google.maps.event.addListener(marker1, 'click', function() {
					infowindow1.open(map,marker1);
				});
				
				// var flag = 'images/flag.png';
				var marker2 = new google.maps.Marker({
					map: map,
					position: des,
					// icon: flag
				});
				var infowindow2 = new google.maps.InfoWindow({ 
					content: "<?php echo $compName . '<br/>' . $address;?>"
				});
			} else {
				alert("Geocode was not successful for the following reason: " + status);
			}
		});
	}
}

</script>

</head>

<body onload="initialize()">
	<!--<div>
		<b>Mode of Travel: </b>
		<select id="mode" onchange="calcRoute();">
		  <option value="DRIVING">Driving</option>
		  <option value="WALKING">Walking</option>
		  <option value="BICYCLING">Bicycling</option>
		</select>
	</div>-->
	<div id="map_canvas">

	</div>
</body>

</html>